import React, { Component } from 'react';
import IceContainer from '@icedesign/container';
import { Tab, Select, Balloon } from '@icedesign/base';
// import axios from 'axios';
// import PropTypes from 'prop-types';
import './TabSelect.scss';

const TabPane = Tab.TabPane;

export default class TabTable extends Component {
  static displayName = 'TabTable';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {
      dataSource: {},
      tabs: [],
      tabName:'',
      tabKey: 0,
    };
  }

  componentDidMount() {
  }

  handleChange = (key) => {
    this.setState({
      tabKey: key,
    });
  };

  // showContent = (tab,key) => {
  //   const clickTrigger = (
  //     <TabPane tab={tab} key={key}>
  //       {this.props.content[key]}
  //     </TabPane>
  //   )  
  // }

  render() {
    return (
      <IceContainer>
        <Tab prefix="three-" size="medium" type="bar" tabPosition="left" activeKey={this.state.tabKey} onChange={this.handleChange}>
          {this.props.tabs.map((item) => {
            return (
                <TabPane tab={item.tab} key={item.key}>
                  {this.props.content[item.key]}
                </TabPane>
            );
          })}
        </Tab>
      </IceContainer>
    );
  }
}

